<style>
.page{
	background: #fafafa;
}
.header{
	background-image: url('~@/static/images/transfer/transfer_member.jpg');
	background-color: #f55858;
	width: 100%;
	height: 100%;
	background-size: 100%;
}
.header-box{
	width: 90%;
	margin: 0 auto;
	padding-left: 40rpx;
}
.header-user{
	height: 105rpx;
	width: 100%;
	overflow: hidden;
	padding-top: 35rpx;
}
.userinfo{
	float: left;
	width: 50%;
}
.user-image{
	height: 105rpx;
	width: 105rpx;
	border-radius: 50rpx;
	float: left;
	margin-right: 30rpx;
}
.user-info{
	float: left;
	color: #fff;
	margin-top: 15rpx;
}
.user-nickname{
	font-size: 34rpx;
}
.user-address{
	font-size: 24rpx;
	margin-top: 10rpx;
}
.user-like{
	float: right;
	width: 146rpx;
	height: 56rpx;
	background: #fff;
	color: #bb1515;
	font-size: 28rpx;
	border-radius: 30rpx;
	text-align: center;
	line-height: 56rpx;
	margin-top: 36rpx;
}
.user-sign{
	font-size: 26rpx;
	color: #fff;
	margin-top: 43rpx;
	padding-bottom: 20rpx;
}
.count-group{
	height: 76rpx;
	width: 100%;
	overflow: hidden;
	color: #fff;
	padding-bottom: 15rpx;
}
.count-group .count{
	width: 25%;
	float: left;
}
.count-num{
	font-weight: bold;
}
.content{
	background: #f5f5f5;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.all-title{
	height: 105rpx;
}
.all-center{
	width: 90%;
	margin: 0 auto;
	height: 100%;
}
.all-line{
	width: 5rpx;
	height: 28rpx;
	background: #ec4041;
	margin-top: 40rpx;
	display: inline-block;
	margin-right: 10rpx;
}
.all-text{
	position: relative;
	top: -4rpx;
}
.goods-content-box{
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: #f5f5f5;
}
.goods-content{
	width: 95%;
	margin: 0 auto;
	height: 100%;
	overflow: hidden;
}
.goods{
	width: 49%;
	height: 546rpx;
	float: left;
	overflow: hidden;
	margin-right: 8rpx;
	margin-bottom: 8rpx;
	background: #fff;
	border-radius: 8rpx;
}
.goods image{
	height: 353rpx;
	width: 100%;
}
.goods:nth-child(even){
	margin-right: 0rpx !important;
}
.goods-title{
	font-size: 34rpx;
	overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap;
	width: 95%;
	margin: 0 auto;
	margin-top: 30rpx;
}
.goods-info{
	height: 100%;
	width: 100%;
	overflow: hidden;
	width: 95%;
	margin: 0 auto;
	margin-top: 50rpx;
}
.goods-price{
	float: left;
	font-size: 39rpx;
	color: #f55959;
}
.price-symbol{
	font-size: 29rpx;
}
.goods-want-num{
	float: right;
	color: #b7b7b7;
	font-size: 28rpx;
	margin-top: 7rpx;
}
</style>
<template>
	<view class="page">
		<view class="header">
			<view class="header-box">
				<view class="header-user">
					<view class="userinfo">
						<image :src="member.head_pic_text" class="user-image" mode=""></image>
						<view class="user-info">
							<view class="user-nickname">
								{{member.nickname}}
							</view>
							<!-- <view class="user-address">
								佛山 | 禅城
							</view> -->
						</view>
					</view>
					<view class="user-like" v-if="resdata.ismyself != '1'" @tap="click_like">	<!-- 如果进入自己的主页，不显示 -->
						{{like_msg}}
					</view>
				</view>
				<view class="user-sign">
					明码实价，不换不议价
				</view>
				<view class="count-group" v-if="resdata.ismyself == '1'">
					<view class="count">
						<view class="count-num">
							{{resdata.count_goods}}
						</view>
						<view class="count-text">
							商品
						</view>
					</view>
					
					<view class="count">
						<view class="count-num">
							{{resdata.on_count}}
						</view>
						<view class="count-text">
							在架
						</view>
					</view>
					
					<view class="count">
						<view class="count-num">
							{{resdata.like}}
						</view>
						<view class="count-text">
							关注
						</view>
					</view>
					
					<view class="count">
						<view class="count-num">
							{{resdata.fans}}
						</view>
						<view class="count-text">
							粉丝
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="content">
			<view class="all-title">
				<view class="all-center">
					<text class="all-line"></text>
					<text class="all-text">全部商品</text>
				</view>
			</view>
			
			<view class="goods-content-box">
				<view class="goods-content">
					<view class="goods" v-for="(item, index) in transfer_list" :key="index" @tap="to_detail(item.id)">
						<image :src="item.photos_text[0]" mode=""></image>
						<view class="goods-title">
							{{item.title}}
						</view>
						<view class="goods-info">
							<view class="goods-price">
								<text class="price-symbol">￥</text>{{item.buyout_price}}
							</view>
							<!-- <view class="goods-want-num">
								7人想要
							</view> -->
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="m-full-loading" v-if="bIsShowLoading">
			<view class="m-loading">
				<image src="../../static/images/loading.gif" mode="widthFix"></image>
			</view>
		</view>
		<view class="m-no-data" v-if="showNodata">
			<image src="../../static/images/no_data.png" mode="widthFix"></image>
		</view>
	</view>
</template>
<script>
	
</script>

<script>
	import henglang from '@/common/common.js';
	export default { 
		data() {
			return {
				transfer_list: {},
				bIsShowLoading: false,
				member: [],
				resdata: [],
				page: 1,
				totalPages: 1,
				loadtype: 'normal',	// 加载数据方式
				merchant_id: 0,
				like_msg: '',
				showNodata:false,
				search_data:{},
				datalist:[]
			}
		},
		onLoad(options){
			let that = this;
			that.merchant_id = options.merchant_id || '75595';
			new Promise((resolve, reject) => {
				henglang.get('Pawn_merchant/index', {merchant_id: that.merchant_id}, true, function (res){
					that.resdata = res.data;
					if(that.resdata.ismyself == '0'){
						that.like_msg = that.resdata.like ? '已关注' : '+关注';
					}
					that.member = that.resdata.member;
					resolve();
				})
			}).then(() => {
				let loaddata = {
					page: that.page
				};
				that.getList(loaddata);
			})
			
		},
		methods: {
			// 上拉加载
			onReachBottom(){
				let that = this
				that.loadtype = 'plus';
				that.page++;
				that.search_data.page = that.page;
				if(that.datalist.length === 0) return false
				that.getList(that.search_data);
			},
			to_detail(id){
				uni.navigateTo({
					url: '/pages/transfer/transfer_view?id=' + id
				})
			},
			// 点击关注
			click_like(){
				let that = this;
				that.bIsShowLoading = true;
				henglang.get('Pawn/handle_favorite', {kind_id: that.merchant_id, type: 2}, true, function (res){
					that.bIsShowLoading = false;
					let resdata = res.data;
					that.like_msg = resdata.code == 'ok' ? '已关注' : '+关注';
				})
			},
			getList(data){
				let that = this;
				if(that.page <= that.totalPages){
					data.merchant_id = that.merchant_id;
					that.bIsShowLoading = true;
					henglang.post('Pawn/transfer_list', data, false,function(res){
						that.bIsShowLoading = false;
						let resdata = res.data;
						let count = resdata.count;
						if (resdata.data.length === 0) {
							that.transfer_list = ''
							that.showNodata = true;
							return false;
						}
						if(that.loadtype == 'plus') {
							that.transfer_list = that.transfer_list.concat(resdata.data);
						}else{
							that.transfer_list = resdata.data;
							that.totalPages = resdata.total_pages;
							uni.stopPullDownRefresh();
						}
					})
				}else{
					return false
				}
			}
		}
	}
</script>